/**
 * 0.获取元素
 */
 let reInp = document.querySelectorAll('.re-inp')
 let reErrMsgP = document.querySelectorAll('.re-inp-box p')
 let reBtn = document.querySelector('.re-btn')
 let changeBtn = document.querySelector('.change-btn')
 
 
 /**
  * 1.定义变量保存验证规则 === 正则表达式
  */
 let regArr = [
   /^[a-zA-Z]\w{5,11}$/,   //6-12: 字母开头,后面跟字母\数字\下划线
   /^1[3456789][0-9]{9}$/, //11  : 
   /^[a-zA-Z]\w{3}$/,      //4位验证码: 字母开头,后面跟字母\数字\下划线
   /^[a-zA-Z]\w{5,11}$/    //6-12: 字母开头,后面跟字母\数字\下划线
 ]
 
 
 /**
  * 2. 需求: 失去焦点验证, 验证账号 手机验证码 手机号 密码
  */
 reInp.forEach(function (dom, i) {
   dom.addEventListener('blur', function () {
 
     //失去焦点,验证输入信息的合法性
     //正则.test( 输入信息 )
     let bool = regArr[i].test(dom.value)
 
     //判断
     if (bool) {//验证通过
       reErrMsgP[i].style.display = 'none'
     } else {//验证失败
       reErrMsgP[i].style.display = 'block'
     }
 
   })
 
 
 })
 
 
 /**
  * 3. 需求: 点击注册按钮,验证账号 手机验证码 手机号 密码
  */
 reBtn.addEventListener('click', function () {
   for (let i = 0; i < reInp.length; i++) {
     //正则.test( 输入信息 )
     let bool = regArr[i].test(reInp[i].value)
 
     //判断
     if (bool) {//验证通过
       reErrMsgP[i].style.display = 'none'
       location.href = '../pages/login.html'
 
     } else {//验证失败
       reErrMsgP[i].style.display = 'block'
       return
     }
   }
 })
 
 /**
  * 4. 需求: 点击change-btn,切换注册点击的状态
  */
 changeBtn.addEventListener('change', function () {
   //获取当前changeBtn的选中状态
   if (changeBtn.checked) {//选中
     reBtn.style.backgroundColor = 'deepskyblue'
     reBtn.disabled = false; //取消禁用
 
   } else {//没有选中
     reBtn.style.backgroundColor = '#ccc'
     reBtn.disabled = true; //禁用
   };
 })